<template>
    <div>
        <!-- 面包屑导航 -->
        <div class="page_top">
            <div class="left_btn" @click="back">
                <img src="../../assets/image/back.png" alt=""/>
            </div>
            <crumbs basetitle="客户" title="客户管理"></crumbs>
        </div>
        <div class="content">
            <el-card>
                <div class="screen">
                    <span class="bord">筛选</span>
                    <div class="utilsbox">
                        <div class="deleate" @click="clear">
                            <img style="margin-top: -1px" src="../../assets/image/容器.png" alt=""/>
                            <span class="clear">清除</span>
                        </div>
                        <div class="deleate" @click="exportcompanylist">
                            <img style="margin-top: -1px" src="../../assets/image/Share.png" alt=""/>
                            <span class="clear">导出</span>
                        </div>
                        <el-popover placement="bottom-start" title="" :width="100" trigger="hover">
                            <div class="blue" @click="exporttbkhxx">投保客户信息</div>
                            <div class="blue" @click="exportbxxd">保险详单</div>
                            <template #reference>
                                <div class="deleate">
                                    <img style="margin-top: -1px" src="../../assets/image/Share.png" alt=""/>
                                    <span class="clear">投保导出</span>
                                </div>
                            </template>
                        </el-popover>
                        <div class="deleate" @click="openorclose">
                            <img style="margin-top: -1px" src="../../assets/image/容器.png" alt=""/>
                            <span class="clear">{{ openorcloseflag === false ? "收起" : "展开" }}</span>
                        </div>
                    </div>
                </div>
                <div class="screen_condition">
                    <div class="formbox">
                        <div class="flex items-center">
                            <span class="flex-no-shrink">公司名称：</span>
                            <!-- @blur="productSelect" -->
                            <el-select style="width: 300px" clearable v-model="companyName" filterable remote
                                       reserve-keyword @change="changecompanyName" placeholder="请输入公司名称"
                                       :remote-method="remoteMethod" :loading="loading">
                                <el-option v-for="item in companylist" :key="item.id" :label="item.companyName"
                                           :value="item.id"/>
                            </el-select>
                        </div>
                        <div class="flex items-center">
                            <span class="flex-no-shrink w-100">超级管理员：</span>
                            <el-input class="w-full flex-1" v-model="adminName" placeholder="请输入超级管理员名称"
                                      clearable
                                      @input="changeadminName"></el-input>
                        </div>
                        <div class="flex items-center">
                            <!-- channel 苏州蓝豚/重庆蓝豚 -->
                            <span class="flex-no-shrink">渠道：</span>
                            <el-select class="w-full flex-1" v-model="ditch" placeholder="请选择渠道信息" clearable
                                       @change="getclientslist">
                                <el-option v-for="item in ditchoptions" :key="item.name" :label="item.name"
                                           :value="item.id"/>
                            </el-select>
                        </div>
                        <!--                        <div class="flex items-center">-->
                        <!--                            <span class="flex-no-shrink">超管手机号：</span>-->
                        <!--                            <el-input class="w-full flex-1" clearable v-model="adminPhone"-->
                        <!--                                      placeholder="请输入超管手机号"-->
                        <!--                                      @input="changeadminphone"></el-input>-->
                        <!--                        </div>-->
                        <div class="flex items-center">
                            <span class="flex-no-shrink">审核状态：</span>
                            <el-select class="w-full flex-1" clearable v-model="auditStatus"
                                       placeholder="请选择审核状态"
                                       @change="getclientslist">
                                <el-option v-for="item in statusoptions" :key="item.value" :label="item.label"
                                           :value="item.value"/>
                            </el-select>
                        </div>
                    </div>
                    <div class="formbox" v-show="!openorcloseflag">
                        <div class="flex items-center">
                            <span class="flex-no-shrink">产品类型：</span>
                            <el-select clearable v-model="producttype" class="m-2 w-full flex-1"
                                       placeholder="请选择产品类型"
                                       @change="changeproducttype">
                                <el-option key="1" label="日日保" value="1"/>
                                <el-option key="2" label="长期保" value="2"/>
                                <el-option key="3" label="团意日保" value="3"/>
                            </el-select>
                        </div>
                        <div class="flex items-center">
                            <span class="flex-no-shrink w-100">选择月份：</span>
                            <el-date-picker clearable v-model="datem" value-format="YYYY-MM" type="month"
                                            class="w-full reset-flex flex-1" placeholder="请选择月份"/>
                        </div>
                        <div class="flex items-center">
                            <span class="flex-no-shrink">保司：</span>
                            <el-select clearable v-model="baosi" class="m-2 w-full flex-1" placeholder="请选择保司"
                                       @focus="handleBSFocus">
                                <el-option v-for="(ele, index) in baosilist" :key="ele.dictValue" :label="ele.dictLabel"
                                           :value="ele.dictValue"/>
                            </el-select>
                        </div>
                        <div class="flex items-center">
                            <span class="flex-no-shrink">余额状态：</span>
                            <el-select clearable v-model="yestatus" class="m-2 w-full flex-1"
                                       placeholder="请选择余额状态"
                                       @change="getclientslist">
                                <el-option key="0" label="全部" value="0"/>
                                <el-option key="1" label="有余额" value="1"/>
                                <el-option key="2" label="余额为零" value="2"/>
                            </el-select>
                        </div>
                    </div>
                    <div class="formbox" v-show="!openorcloseflag">
                        <div class="flex items-center">
                            <span class="flex-no-shrink">所属销售：</span>
                            <el-input class="w-full flex-1" clearable v-model="salename" placeholder="请输入销售名"
                                      @input="getclientslist"></el-input>
                        </div>
                        <div class="flex items-center">
                            <span class="flex-no-shrink">超管手机号：</span>
                            <el-input class="w-full flex-1" clearable v-model="adminPhone"
                                      placeholder="请输入超管手机号"
                                      @input="changeadminphone"></el-input>
                        </div>
                        <!--                        <div></div>-->
                        <div></div>
                        <div></div>
                    </div>
                </div>
            </el-card>
            <el-card style="margin-top: 16px">
                <div class="table-list">
                    <el-table :data="tableData" ref="multipleTableRef" :border="true" style="width: 100%"
                              @selection-change="handleSelectionChange" :header-cell-style="{
                            background: '#FAFAFC',
                            color: '#202536',
                        }">
                        <el-table-column type="selection" width="40"/>
                        <el-table-column prop="customerNo" label="客户ID" align="center" min-width="100"
                                         fixed></el-table-column>
                        <el-table-column prop="date" label="客户名" align="center" min-width="300" fixed>
                            <template #default="scope">
                                <div>
                                    <!--                                    <el-tag v-show="scope.row.isDissolve === 0">通过</el-tag>-->
                                    <!--                                    <el-tag v-show="scope.row.isDissolve === 1" class="ml-2" type="danger">已解散-->
                                    <!--                                    </el-tag>-->
                                    <el-tag v-show="scope.row.auditStatus === 0" class="ml-2" type="warning">待审核
                                    </el-tag>
                                    <el-tag v-show="scope.row.auditStatus === 1" class="ml-2" type="">已通过</el-tag>
                                    <el-tag v-show="scope.row.auditStatus === 2" class="ml-2" type="danger">已驳回
                                    </el-tag>
                                    {{ scope.row.companyName }}
                                </div>
                                <div class="b_d" v-show="scope.row.companyAbbreviation">
                                    {{ scope.row.companyAbbreviation }}
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="name" label="超级管理员" align="center" width="200">
                            <template #default="scope">
                                <div>{{ scope.row.adminName }}</div>
                                <div class="b_d">
                                    {{
                                        ("" + scope.row.adminPhone).replace(
                                            /(\d{3})\d{4}(\d{4})/,
                                            "$1****$2"
                                        ) === "null"
                                            ? "--"
                                            : ("" + scope.row.adminPhone).replace(
                                                /(\d{3})\d{4}(\d{4})/,
                                                "$1****$2"
                                            )
                                    }}
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="address" label="子弹发薪" align="center" width="200">
                            <template #default="scope">
                                <div v-show="scope.row.isOpenPaySalary === 1">
                                    <div>剩余{{ scope.row.paySurplusDays }}天</div>
                                    <!--                  <div class="b_d">{{ scope.row.paySaleName }}</div>-->
                                    <el-popover placement="bottom" title="" :width="200" trigger="click" content="">
                                        <el-select filterable style="width: 100%;" v-model="sj.saleId"
                                                   placeholder="搜索姓名" @change="changexs">
                                            <el-option v-for="item in allseller" :key="item.saleId"
                                                       :label="item.saleName" :value="item.saleId"/>
                                        </el-select>
                                        <template #reference>
                                            <div class="b_d" @click="openzdfxchange(scope.row)">{{
                                                    scope.row.paySaleName
                                                }}
                                                <el-icon>
                                                    <ArrowDown/>
                                                </el-icon>
                                            </div>
                                        </template>
                                    </el-popover>
                                </div>
                                <div v-show="scope.row.isOpenPaySalary === 0">
                                    <div>未开通</div>
                                    <div class="b_d">--</div>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="address" label="长期保" align="center" width="200">
                            <template #default="scope">
                                <div v-show="scope.row.isOpenPeriod === 1">
                                    <div class="flex items-center w-full justify-center gap-10px">
                                        <span>¥{{ scope.row.periodAccountBalance }}</span>
                                        <el-button text type="primary"
                                                   @click="onRecharge(1,scope.row.companyName,scope.row.insureChannelId,scope.row.companyId)">
                                            充值
                                        </el-button>
                                    </div>
                                    <div class="b_d flex-center">
                                        <el-tag v-if="scope.row.insureBlackList" class="ml-2" type="info"
                                                color="#BDBEC3"><span class="fc-black">拉黑</span>
                                        </el-tag>
                                        <el-tag v-if="scope.row.periodInsureStatus?.refusalGuaranteeStatus" class="ml-2"
                                                type="danger">拒保
                                        </el-tag>
                                        <el-tag v-if="scope.row.periodInsureStatus?.blockedAccount" class="ml-2"
                                                type="danger">冻结
                                        </el-tag>
                                        <el-tag v-if="scope.row.periodInsureStatus?.antiDatedPolicy" class="ml-2"
                                                type="danger">倒投保
                                        </el-tag>
                                    </div>
                                    <el-popover placement="bottom" title="" :width="200" trigger="click" content="">
                                        <el-select filterable style="width: 100%;" v-model="sj.saleId"
                                                   placeholder="搜索姓名" @change="changexs">
                                            <el-option v-for="item in allseller" :key="item.saleId"
                                                       :label="item.saleName" :value="item.saleId"/>
                                        </el-select>
                                        <template #reference>
                                            <div class="b_d" @click="openlongchange(scope.row)">{{
                                                    scope.row.periodSaleName
                                                }}
                                                <el-icon>
                                                    <ArrowDown/>
                                                </el-icon>
                                            </div>
                                        </template>
                                    </el-popover>
                                </div>
                                <div v-show="scope.row.isOpenPeriod === 0">
                                    <div>未开通</div>
                                    <el-tag v-if="scope.row.insureBlackList" class="ml-2" type="info"
                                            color="#BDBEC3"><span class="fc-black">拉黑</span>
                                    </el-tag>
                                    <div class="b_d">--</div>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="address" label="日日保" align="center" width="200">
                            <template #default="scope">
                                <div v-show="scope.row.isOpenWesure === 1">
                                    <div class="flex items-center w-full justify-center gap-10px">
                                        <span>¥{{ scope.row.wesureAccountBalance }}</span>
                                        <el-button text type="primary"
                                                   @click="onRecharge(2,scope.row.companyName,scope.row.wesureChannelId,scope.row.companyId)">
                                            充值
                                        </el-button>
                                    </div>
                                    <div class="b_d flex-center">
                                        <el-tag v-if="scope.row.wesurBlackList" class="ml-2" type="info"
                                                color="#BDBEC3"><span class="fc-black">拉黑</span>
                                        </el-tag>
                                        <el-tag v-if="scope.row.weusreStatus?.refusalGuaranteeStatus" class="ml-2"
                                                type="danger">拒保
                                        </el-tag>
                                        <el-tag v-if="scope.row.weusreStatus?.blockedAccount" class="ml-2"
                                                type="danger">冻结
                                        </el-tag>
                                        <el-tag v-if="scope.row.weusreStatus?.antiDatedPolicy" class="ml-2"
                                                type="danger">倒投保
                                        </el-tag>
                                    </div>
                                    <el-popover placement="bottom" title="" :width="200" trigger="click" content="">
                                        <el-select filterable style="width: 100%;" v-model="sj.saleId"
                                                   placeholder="搜索姓名" @change="changexs">
                                            <el-option v-for="item in allseller" :key="item.saleId"
                                                       :label="item.saleName" :value="item.saleId"/>
                                        </el-select>
                                        <template #reference>
                                            <div class="b_d" @click="opendaychange(scope.row)">{{
                                                    scope.row.wesureSaleName
                                                }}
                                                <el-icon>
                                                    <ArrowDown/>
                                                </el-icon>
                                            </div>
                                        </template>
                                    </el-popover>
                                </div>
                                <div v-show="scope.row.isOpenWesure === 0">
                                    <div>未开通</div>
                                    <el-tag v-if="scope.row.wesurBlackList" class="ml-2" type="info"
                                            color="#BDBEC3"><span class="fc-black">拉黑</span>
                                    </el-tag>
                                    <div class="b_d">--</div>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="address" label="团意日保" align="center" width="200">
                            <template #default="scope">
                                <div v-show="scope.row.isOpenTyrbStatus === 1">
                                    <el-popover placement="bottom" title="" :width="200" trigger="click" content="">
                                        <el-select filterable style="width: 100%;" v-model="sj.saleId"
                                                   placeholder="搜索姓名" @change="changexs">
                                            <el-option v-for="item in allseller" :key="item.saleId"
                                                       :label="item.saleName" :value="item.saleId"/>
                                        </el-select>
                                        <template #reference>
                                            <div class="b_d" @click="opentyrbchange(scope.row)">{{
                                                    scope.row.tyxSaleName
                                                }}
                                                <el-icon>
                                                    <ArrowDown/>
                                                </el-icon>
                                            </div>
                                        </template>
                                    </el-popover>
                                </div>
                                <div v-show="scope.row.isOpenTyrbStatus === 0">
                                    <div>未开通</div>
                                    <div class="b_d">--</div>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="address" label="电子签" align="center" width="200">
                            <template #default="scope">
                                <div v-show="scope.row.isOpenEleSign === 1">
                                    <div>¥{{ scope.row.eleAccountBalance }}</div>
                                    <!--                  <div class="b_d">{{ scope.row.eleSaleName }}</div>-->
                                    <el-popover placement="bottom" title="" :width="200" trigger="click" content="">
                                        <el-select filterable style="width: 100%;" v-model="sj.saleId"
                                                   placeholder="搜索姓名" @change="changexs">
                                            <el-option v-for="item in allseller" :key="item.saleId"
                                                       :label="item.saleName" :value="item.saleId"/>
                                        </el-select>
                                        <template #reference>
                                            <div class="b_d" @click="openelechange(scope.row)">{{
                                                    scope.row.eleSaleName
                                                }}
                                                <el-icon>
                                                    <ArrowDown/>
                                                </el-icon>
                                            </div>
                                        </template>
                                    </el-popover>
                                </div>
                                <div v-show="scope.row.isOpenEleSign === 0">
                                    <div>未开通</div>
                                    <div class="b_d">--</div>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="address" label="渠道" align="center" width="200">
                            <template #default="scope">
                                <div>
                                    <div v-if="scope.row.channelName?.length === 0">--</div>
                                    <div v-else v-for="(ele, i) in scope.row.channelName" :key="i">{{ ele }}</div>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column fixed="right" label="操作" width="60" align="center">
                            <template #default="scope">
                                <el-button link style="color: #0256ff" size="small" @click.prevent="detail(scope.row)">
                                    详情
                                </el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <pagination :total="total" :currentPage="currentPage" :pageSize="pageSize"
                                @SizeChange="handleSizeChange" @CurrentChange="handleCurrentChange"></pagination>
                </div>
            </el-card>
        </div>
        <el-dialog v-model="dialogFormVisible" title="条件选择" width="500">
            <el-form :model="exportForm" :rules="rules" ref="ruleFormRef">
                <el-form-item label="渠道来源:" prop="qdly" :label-width="100">
                    <el-select v-model="exportForm.qdly" placeholder="请选择" @change="onChangeqdly">
                        <el-option v-for="(ele, index) in queryOpenAccountList" :key="ele.id" :label="ele.companyName"
                                   :value="ele.id"/>
                    </el-select>
                </el-form-item>
                <el-form-item label="所属行业:" prop="industry" :label-width="100">
                    <el-select v-model="exportForm.industry" placeholder="请选择" clearable>
                        <el-option v-for="(ele, index) in industrylist" :key="ele.id" :label="ele.dictLabel"
                                   :value="ele.dictValue"/>
                    </el-select>
                </el-form-item>
                <el-form-item label="产品类型:" :label-width="100">
                    <el-radio-group v-model="exportForm.cplx" :disabled="exportForm.qdly !== '-1'"
                                    @change="changeproducttypeInDia">
                        <el-radio value="1">日日保</el-radio>
                        <el-radio value="2">长期保</el-radio>
                        <el-radio value="3">团意保</el-radio>
                    </el-radio-group>
                </el-form-item>
                <div v-if="exportForm.qdly === '-1'">
                    <el-form-item label="保司:" :label-width="100">
                        <el-select v-model="exportForm.bs" clearable placeholder="请选择">
                            <el-option v-for="(ele, index) in baosilistDia" :key="ele.dictValue" :label="ele.dictLabel"
                                       :value="ele.dictValue"/>
                        </el-select>
                    </el-form-item>
                    <el-form-item v-if="exportForm.cplx !== '3'" label="渠道:" :label-width="100">
                        <el-select v-model="exportForm.qd" clearable placeholder="请选择">
                            <el-option v-for="item in ditchoptions" :key="item.name" :label="item.name"
                                       :value="item.id"/>
                        </el-select>
                    </el-form-item>
                    <el-form-item v-if="exportForm.cplx !== '3'" prop="month" label="选择月份:" :label-width="100">
                        <el-date-picker clearable v-model="exportForm.month" value-format="YYYY-MM" type="month"
                                        placeholder="请选择"/>
                    </el-form-item>
                    <el-form-item label="所属销售:" :label-width="100">
                        <el-select v-model="exportForm.ssxs" clearable placeholder="请选择" filterable>
                            <el-option v-for="item in allseller" :key="item.saleId" :label="item.saleName"
                                       :value="item.saleId"/>
                        </el-select>
                    </el-form-item>
                </div>
                <div v-else>
                    <el-form-item label="选择月份:" prop="monthc" :label-width="100">
                        <el-date-picker clearable v-model="exportForm.monthc" value-format="YYYY-MM" type="month"
                                        placeholder="请选择"/>
                    </el-form-item>
                </div>
            </el-form>
            <template #footer>
                <div class="flex items-center w-full justify-center">
                    <el-button @click="diaExportCancel">取消</el-button>
                    <el-button type="primary" @click="diaExportSure(ruleFormRef)">
                        确定
                    </el-button>
                </div>
            </template>
        </el-dialog>
    </div>
    <insureRechargeDialog v-model:show="showRechargeDialog" :type="rechargeType" :ditch="rechargeChannelId"
                          :companyName="rechargeCompanyName"
                          :rechargeCompanyId="rechargeCompanyId" @success="getclientslist"/>
</template>

<script setup lang="ts">
import pagination from '../../components/pagination.vue'
import {ref, onMounted, reactive} from 'vue'
import {ElMessage, FormInstance, FormRules, TableColumnCtx} from 'element-plus'
import {
    exportlongbxxdapi,
    exportdaybxxdapi,
    exportlongkhlbapi,
    exportdaykhlbapi,
    getlongtimeinsuranceaudicompanytapi,
    geteverydayinsuranceaudicompanytapi,
    getQueryOpenAccountApi,
    exportcompanylistapi,
    getditchapi,
    getclientsapi,
    getpassedcompanyapi,
    getmarketapi,
    changemarketapi,
    setmarketapi, getDicts,
} from '../../api/api'
import type {QueryOpenAccountDto} from '../../api/api'
import {useRouter} from 'vue-router'
import {shake} from '../../utils/utils'
import baseurl from '../../api/env'
import dayjs from 'dayjs'
import InsureRechargeDialog from "@/views/clients/dialogComponents/insureRechargeDialog.vue";

const showRechargeDialog = ref<boolean>(false)
const rechargeType = ref<number>(0)
const rechargeCompanyName = ref<string>('')
const rechargeCompanyId = ref(0)
const rechargeChannelId = ref(0)
const dialogFormVisible = ref(false)
const changeadminphone = () => {
    shake(getclientslist, 500)
}
const ruleFormRef = ref<FormInstance>()
const rules = reactive<FormRules<any>>({
    qdly: [
        {
            required: true,
            message: '请选择渠道来源',
            trigger: 'change',
        },
    ],
    // industry: [
    //     {
    //         required: true,
    //         message: '请选择所属行业',
    //         trigger: 'change',
    //     },
    // ],
    month: [
        {
            required: true,
            message: '请选择月份',
            trigger: 'change',
        },
    ],
    monthc: [
        {
            required: true,
            message: '请选择月份',
            trigger: 'change',
        },
    ],
})
const onRecharge = (type: number, name: string, channelId: number,companyId:number) => {
    showRechargeDialog.value = true
    rechargeType.value = type
    rechargeCompanyName.value = name
    rechargeChannelId.value = channelId
    rechargeCompanyId.value = companyId
}
const exportForm = ref({
    qdly: '',
    cplx: '',
    bs: '',
    ssxs: '',
    qd: '',
    industry: '',
    month: '',
    monthc: ''
} as any)
const adminPhone = ref('')
const openzdfxchange = (res: any) => {
    console.log(res)
    sj.value.id = res.payDealId
    sj.value.saleOldId = res.paySaleId
    sj.value.companyId = res.companyId
    sj.value.productType = 0
    sj.value.serviceStartTime = dayjs().startOf('month').format('YYYY-MM-DD')
}
const openlongchange = (res: any) => {
    console.log(res)
    sj.value.id = res.periodDealId
    sj.value.saleOldId = res.periodSaleId
    sj.value.companyId = res.companyId
    sj.value.productType = 3
    sj.value.serviceStartTime = dayjs().startOf('month').format('YYYY-MM-DD')
}
const opendaychange = (res: any) => {
    console.log(res)
    sj.value.id = res.wesureDealId
    sj.value.saleOldId = res.wesureSaleId
    sj.value.companyId = res.companyId
    sj.value.productType = 2
    sj.value.serviceStartTime = dayjs().startOf('month').format('YYYY-MM-DD')
}
const opentyrbchange = (res: any) => {
    console.log(res)
    sj.value.id = res.tyxDealId
    sj.value.saleOldId = res.tyxSaleId
    sj.value.companyId = res.companyId
    sj.value.productType = 6
    sj.value.serviceStartTime = dayjs().startOf('month').format('YYYY-MM-DD')
}
const openelechange = (res: any) => {
    console.log(res)
    sj.value.companyId = res.companyId
    sj.value.id = res.eleDealId
    sj.value.saleOldId = res.eleSaleId
    sj.value.productType = 1
    sj.value.serviceStartTime = dayjs().startOf('month').format('YYYY-MM-DD')
}
const sj = ref<any>({
    companyId: '',
    id: '',
    productType: '',
    saleId: '',
    saleOldId: '',
    serviceStartTime: '',
    serviceState: 0,
})
const changexs = (e: any) => {
    console.log(e)
    if (!sj.value.saleOldId) {
        setmarketapi({
            companyId: sj.value.companyId,
            id: sj.value.id,
            productType: sj.value.productType,
            saleId: sj.value.saleId,
            serviceStartTime: sj.value.serviceStartTime,
            serviceState: sj.value.serviceState,
        }).then((res: any) => {
            console.log(res)
            if (res.code === 200) {
                getclientslist()
                ElMessage({
                    message: res.msg,
                    type: 'success',
                })
            }
        })
    } else {
        changemarketapi(sj.value).then((res: any) => {
            console.log(res)
            if (res.code === 200) {
                getclientslist()
                ElMessage({
                    message: res.msg,
                    type: 'success',
                })
            }
        })
    }
    sj.value.companyId = ''
    sj.value.id = ''
    sj.value.productType = ''
    sj.value.saleId = ''
    sj.value.saleOldId = ''
    sj.value.serviceStartTime = ''
}
const allseller = ref<any>([])
const getmarket = async () => {
    const res: any = await getmarketapi()
    console.log(res, '销售列表')
    allseller.value = res
}

const router = useRouter()
const loading = ref(false)
onMounted(() => {
    getclientslist()
    getditch()
    getmarket()
})
const remoteMethod = (query: string) => {
    console.log(query)
    if (query) {
        loading.value = true
        getcompany(query)
    } else {
        companylist.value = []
    }
}
const companylist = ref<any>([])
// 获取公司列表
const getcompany = async (val: any) => {
    // const res: any = await getpassedcompanyapi({companyName: val, auditStatus: 1})
    const res: any = await getpassedcompanyapi({companyName: val})
    console.log(res, '获取公司列表')
    companylist.value = res
    companylist.value.forEach((i: any) => {
        i.companyName =
            i.companyName + (i.customerNo ? i.customerNo : '')
    })
    loading.value = false
}
const diaExportSure = async (formEl: FormInstance | undefined) => {
    if (!formEl) return
    await formEl.validate(async (valid, fields) => {
        if (valid) {
            if (exportForm.value.cplx === '1') {
                exportdaybxxdapi({
                    queryMonth: exportForm.value.month,
                    insureCompanyType: exportForm.value.bs,
                    productType: 0,
                    channelId: exportForm.value.qd,
                    saleId: exportForm.value.ssxs,
                    industry: exportForm.value.industry,
                    companyId: exportForm.value.qdly === '-1' ? '' : exportForm.value.qdly
                }).then((res: any) => {
                    console.log(res)
                    window.location.href =
                        baseurl + '/common/download?delete=true&fileName=' + res
                })
            } else if (exportForm.value.cplx === '2') {
                exportlongbxxdapi({
                    queryMonth: exportForm.value.month || exportForm.value.monthc,
                    insurCompany: exportForm.value.bs,
                    channelId: exportForm.value.qd,
                    saleId: exportForm.value.ssxs,
                    industry: exportForm.value.industry,
                    companyId: exportForm.value.qdly === '-1' ? '' : exportForm.value.qdly
                }).then((res: any) => {
                    console.log(res)
                    window.location.href =
                        baseurl + '/common/download?delete=true&fileName=' + res
                })
            } else if (exportForm.value.cplx === '3') {
                exportdaybxxdapi({
                    queryMonth: exportForm.value.month,
                    insureCompanyType: exportForm.value.bs,
                    productType: 1,
                    channelId: exportForm.value.qd,
                    saleId: exportForm.value.ssxs,
                    industry: exportForm.value.industry,
                    companyId: exportForm.value.qdly === '-1' ? '' : exportForm.value.qdly
                }).then((res: any) => {
                    console.log(res)
                    window.location.href =
                        baseurl + '/common/download?delete=true&fileName=' + res
                })
            }
            await ElMessage({
                message: '导出成功',
                type: 'success',
            })
            await diaExportCancel()
        } else {
            console.log('error submit!', fields)
        }
    })

}
const exportbxxd = async () => {
    await diaExportCancel()
    await getQueryOpenAccount()
    await getIndustryList()
    dialogFormVisible.value = true
}
const queryOpenAccountList = ref([] as QueryOpenAccountDto[])
// 获取渠道来源列表
const getQueryOpenAccount = async () => {
    queryOpenAccountList.value = await getQueryOpenAccountApi()
    queryOpenAccountList.value.unshift({companyName: '系统', id: '-1'})
}
const industrylist = ref<any>([])
// 获取行业列表
const getIndustryList = async () => {
    const res: any = await getDicts('saas_company_industry')
    console.log(res, '行业列表111')
    industrylist.value = res
}
const exporttbkhxx = () => {
    console.log(companyName.value)
    if (!producttype.value) {
        ElMessage({
            message: '请选择保险类型',
            type: 'warning',
        })
        return
    }
    if (producttype.value === '1') {
        exportdaykhlbapi({
            queryMonth: datem.value,
            insureCompanyType: baosi.value,
            companyId: companyName.value,
        }).then((res: any) => {
            console.log(res)
            window.location.href =
                baseurl + '/common/download?delete=true&fileName=' + res
        })
        return
    }
    if (producttype.value === '3') {
        exportdaykhlbapi({
            queryMonth: datem.value,
            insureCompanyType: baosi.value,
            companyId: companyName.value,
        }).then((res: any) => {
            console.log(res)
            window.location.href =
                baseurl + '/common/download?delete=true&fileName=' + res
        })
        return
    }
    if (producttype.value === '2') {
        exportlongkhlbapi({
            queryMonth: datem.value,
            insureCompanyType: baosi.value,
            companyId: companyName.value,
        }).then((res: any) => {
            console.log(res)
            window.location.href =
                baseurl + '/common/download?delete=true&fileName=' + res
        })
        return
    }
}
const getlongtimeinsuranceaudicompanyt = async (val: boolean) => {
    const res: any = await getlongtimeinsuranceaudicompanytapi()
    console.log(res, '长期保')
    if (val) {
        baosilistDia.value = res

    } else {
        baosilist.value = res
    }
}
const geteverydayinsuranceaudicompanyt = async (val: boolean) => {
    const res: any = await geteverydayinsuranceaudicompanytapi()
    console.log(res, '日日保')
    if (val) {
        baosilistDia.value = res

    } else {
        baosilist.value = res
    }
}
const baosilist = ref<any>([])
const baosilistDia = ref<any>([])
const changeproducttype = (val: any) => {
    console.log(val)
    if (val === '') {
        baosilist.value = []
    }
    if (val === '1') {
        geteverydayinsuranceaudicompanyt(false)
    }
    if (val === '2') {
        getlongtimeinsuranceaudicompanyt(false)
    }
    if (val === '3') {
        geteverydayinsuranceaudicompanyt(false)
    }
    getclientslist()
}
const onChangeqdly = (val: any) => {
    console.log(val)
    if (val !== '-1') {
        exportForm.value.cplx = '2'
        exportForm.value.bs = ''
        exportForm.value.qd = ''
        exportForm.value.month = ''
        exportForm.value.monthc = ''
        exportForm.value.ssxs = ''
    }
}
const changeproducttypeInDia = (val: any) => {
    console.log(val)
    if (val === '') {
        baosilistDia.value = []
    }
    if (val === '1') {
        geteverydayinsuranceaudicompanyt(true)
    }
    if (val === '2') {
        getlongtimeinsuranceaudicompanyt(true)
    }
    if (val === '3') {
        exportForm.value.month = ''
        exportForm.value.qd = ''
        geteverydayinsuranceaudicompanyt(true)
    }
}
const exportcompanylist = () => {
    if (multipleSelection.value.length === 0) {
        ElMessage({
            message: '请选择公司',
            type: 'warning',
        })
    } else {
        const arr: any = []
        multipleSelection.value.forEach((ele: any, i: any) => {
            arr.push(ele.companyId)
        })
        exportcompanylistapi(arr).then((res: any) => {
            console.log(res)
            window.location.href =
                baseurl + '/common/download?delete=true&fileName=' + res
            multipleTableRef.value!.clearSelection()
        })
    }
}
const multipleTableRef = ref()
const handleSelectionChange = (val: any) => {
    multipleSelection.value = val
}
const multipleSelection = ref<any>([])
// 获取渠道列表
const getditch = () => {
    getditchapi().then((res: any) => {
        console.log(res, 'aaaaaaaa')
        ditchoptions.value = res
    })
}
const ditchoptions = ref<any>([])
const openorcloseflag = ref(false)
const openorclose = () => {
    openorcloseflag.value = !openorcloseflag.value
}
const salename = ref('')
const yestatus = ref('')
const silerfpstatus = ref('')
const baosi = ref('')
const datem = ref('')
const ditch = ref('')
const producttype = ref('')
// 获取用户列表
const getclientslist = () => {
    getclientsapi({
        companyId: companyName.value,
        auditStatus: auditStatus.value?.trim(),
        adminName: adminName.value,
        pageSize: pageSize.value,
        channelId: ditch.value,
        pageNum: currentPage.value,
        adminPhone: adminPhone.value,
        // 销售分配状态
        // salerfpstatus: silerfpstatus.value,
        saleName: salename.value,
        balanceType: yestatus.value,
        isOpenWesure: producttype.value === '1' ? 1 : '',
        isOpenTyrbStatus: producttype.value === '3' ? 1 : '',
        isOpenPeriod: producttype.value === '2' ? 1 : '',
    }).then((res: any) => {
        console.log(res)
        tableData.value = res.list
        total.value = res.totalCount
    })
}
// 表单数据
const companyName = ref('')
const adminName = ref('')
const auditStatus = ref('1')

// 分页相关数据
const currentPage = ref(1)
const pageSize = ref(10)
const total = ref(100)
// 切换每页几条
const handleSizeChange = (val: number) => {
    pageSize.value = val
    getclientslist()
}
// 切换页数
const handleCurrentChange = (val: number) => {
    currentPage.value = val
    getclientslist()
}
// 改变公司名  管理员名触发事件
const changecompanyName = () => {
    console.log(1212121)
    getclientslist()
}
const changeadminName = () => {
    shake(getclientslist, 500)
}
// const productSelect = (e:any) => {
//     const value = e.target.value // 输入框值
//     if (value) { // 你输入才有这个值 不为空，如果你下拉框选择的话 这个值为空
//         companyName.value = value
//     }
// }
const changeauditStatus = (val: string) => {
    // console.log(val);
    auditStatus.value = val
    getclientslist()
}

interface User {
    id: string;
    name: string;
    amount1: string;
    amount2: string;
    amount3: number;
}

interface SpanMethodProps {
    row: User;
    column: TableColumnCtx<User>;
    rowIndex: number;
    columnIndex: number;
}

// 审核状态框数据
const statusoptions = [
    {
        value: '0',
        label: '待审核',
    },
    {
        value: '1',
        label: '审核通过',
    },
    {
        value: '2',
        label: '审核驳回',
    },
]
const detail = (ele: any) => {
    router.push({path: '/cockpit', query: {id: ele.companyId}})
}
// 表格数据
const tableData = ref([])
const back = () => {
    window.history.back()
}
// 清空筛选条件
const clear = () => {
    companyName.value = ''
    adminName.value = ''
    auditStatus.value = ''
    salename.value = ''
    yestatus.value = ''
    silerfpstatus.value = ''
    baosi.value = ''
    datem.value = ''
    producttype.value = ''
    ditch.value = ''
    getclientslist()
}

const handleBSFocus = () => {
    if (!producttype.value) {
        ElMessage.warning({
            message: '请先选择产品类型',
        })
    }
}
const diaExportCancel = async () => {
    exportForm.value.qdly = '-1'
    exportForm.value.cplx = '1'
    exportForm.value.bs = ''
    exportForm.value.qd = ''
    exportForm.value.industry = ''
    exportForm.value.month = ''
    exportForm.value.monthc = ''
    exportForm.value.ssxs = ''
    await geteverydayinsuranceaudicompanyt(true)
    dialogFormVisible.value = false
}
</script>

<style lang="scss" scoped>
.flex-center {
    width: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
}

.utilsbox {
    display: flex;
    align-items: center;

    .deleate {
        margin-right: 10px;
    }
}

.content {
    max-height: 800px;
    overflow: auto;
    box-sizing: border-box;
    margin: 16px;
}

.screen {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 56px;
    border-bottom: 2px solid #f4f4f7;

    .deleate {
        cursor: pointer;
        display: flex;
        align-items: center;
    }

    .bord {
        font-weight: 700;
    }

    img {
        margin-right: 10px;
        margin-top: 5px;
    }

    .clear {
        color: rgba(148, 151, 177, 1);
        font-size: 14px;
    }
}

.screen_condition {
    box-sizing: border-box;
    padding: 0 20px;
    margin-top: 16px;

    .formbox {
        margin-top: 16px;
        width: 100%;
        // box-sizing: border-box;
        // display: flex;
        // align-items: center;
        // justify-content: space-between;
        // gap: 30px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 30px;
    }
}

.table-list {
    //min-height: 580px;

    .b_d {
        padding-top: 10px;
        margin-top: 10px;
    }

    .pagination {
        margin-top: 20px;
        display: flex;
        align-items: center;
        justify-content: end;
    }
}

.left_btn {
    width: 32px;
    height: 22px;

    img {
        width: 100%;
        height: 100%;
    }
}

.upfile {
    float: right;
    cursor: pointer;
}

.blue {
    color: #0256ff;
    text-align: center;
    cursor: pointer;
    margin-bottom: 5px;
}

.w-100 {
    width: 100px;
}

:deep(.el-date-editor.el-input) {
    width: 100%;
}

:deep(.reset-flex .el-input__wrapper) {
    display: flex;
}

.fc-black {
    color: #202536;
}
</style>
